import 'package:flutter/material.dart';
import 'package:flutter_demo/conf/app_colors.dart';

///自定义主题文本样式
const textTheme = TextTheme(
  titleMedium: TextStyle(
      fontFamily: "sans-serif",
      fontWeight: FontWeight.normal,
      fontSize: 16,
      //lineHeight=fontSize*height=24
      height: 1.5,
      letterSpacing: 0.2),
  titleSmall: TextStyle(
      fontFamily: "sans-serif",
      fontWeight: FontWeight.w500,
      fontSize: 12,
      height: 1.5,
      letterSpacing: 0.2),
  bodyLarge: TextStyle(
      fontWeight: FontWeight.normal,
      fontSize: 16,
      height: 1.5,
      letterSpacing: 0.5),
  labelMedium: TextStyle(
      fontFamily: "sans-serif",
      fontWeight: FontWeight.normal,
      fontSize: 12,
      height: 1.67,
      letterSpacing: 0.1,
      color: AppColors.blueGrey60),
);

///选择一个颜色作为种子，sdk自动生成一整套material主题配色
class AppThemeWithSingleColor {
  ///亮色主题
  static ThemeData light = ThemeData(
    ///使用Material3主题，默认true(Material2 AppBar使用主色调，而Material3 AppBar使用浅色调)
    ///M3对比M2
    ///- 动态色彩系统：支持基于用户设备壁纸自动生成主题色，通过算法自动生成一套和谐的配色
    ///- 形状语言：引入圆角半径分级，取代M2固定圆角（M3为动态圆角，不同大小的按钮圆角大小不同）
    ///- 深度与阴影简化：为减少M2中复杂的阴影层级，M3中使用surface层级（surface不同的变种）和微妙阴影（Elevation1-3）来表达深度
    useMaterial3: true,
    //标记这个主题是亮色主题，不设置默认就是light
    brightness: Brightness.light,
    colorScheme: ColorScheme.fromSeed(
      brightness: Brightness.light, //标记这个颜色是亮色，不设置默认就是light，亮色与暗色生成的色彩组合会有所不同
      seedColor: AppColors.blue80, //种子颜色，Material3会根据种子色自动设置主色调及其变种颜色
    ),
    textTheme: textTheme,
  );

  ///暗色主题
  static ThemeData dark = ThemeData(
    brightness: Brightness.dark,
    colorScheme: ColorScheme.fromSeed(
      brightness: Brightness.dark,
      seedColor: AppColors.blue40,
    ),
    textTheme: textTheme,
  );
}

///自定义主题颜色
class AppThemeWithCustomColor {
  ///亮色主题
  static ThemeData light = ThemeData(
    //自定义主题颜色
    colorScheme: ColorScheme.fromSeed(
      seedColor: AppColors.blue80, //Material3主题配色，先从seed创建再覆盖自定义颜色
    ).copyWith(
      ///主色（品牌识别与核心交互）
      ///- 主导航与品牌标识（顶部导航栏Material2使用primary，Material3使用surface）
      ///- 主要操作按钮（如确认、提交按钮）
      ///- 标签与选中状态（选项卡、分段按钮选中状态背景色、标签页指示器等）
      primary: AppColors.blue40,
      onPrimary: AppColors.grey99,
      primaryContainer: AppColors.blue90,
      onPrimaryContainer: AppColors.blue10,
      inversePrimary: AppColors.blue80,

      ///辅助色（次要交互与功能区分）
      ///- 次要操作按钮（如取消、编辑、分享等按钮）
      ///- 悬浮按钮
      ///- 选中状态与进度反馈（进度条、开关激活状态、列表项选中背景）
      secondary: AppColors.darkBlue40,
      onSecondary: AppColors.grey99,
      secondaryContainer: AppColors.darkBlue90,
      onSecondaryContainer: AppColors.darkBlue10,

      ///第三色（细节交互与装饰元素）
      ///- 过滤与筛选控件（下拉菜单选中项、筛选标签背景色、日期选择器高亮日期）
      ///- 图标与装饰元素（非核心功能图标（如设置、帮助图标）的颜色，或卡片、对话框的边框装饰色（需保持低饱和度，避免视觉干扰）。）
      ///- 状态提示与反馈（成功 / 警告 / 错误状态的轻量级提示（如 Toast 消息的图标色），或加载状态的骨架屏（Skeleton）分隔线）
      ///- 动态效果与微交互（按钮悬停、点击时的涟漪动画（Ripple Effect）颜色，或列表项滑动时的背景渐变）
      tertiary: AppColors.yellow40,
      onTertiary: AppColors.grey99,
      tertiaryContainer: AppColors.yellow90,
      onTertiaryContainer: AppColors.yellow10,

      ///错误颜色
      ///- 危险操作按钮（删除、注销账号等按钮）
      ///- 错误提示（图标、文本、边框）
      error: AppColors.red40,
      onError: AppColors.grey99,
      errorContainer: AppColors.red90,
      onErrorContainer: AppColors.red10,

      ///背景色（用于整个页面的背景色）
      ///- 虽然说被surface取代，但实际上目前的设备都还有在使用该颜色，仍需设置
      background: AppColors.grey99,
      onBackground: AppColors.grey10,

      ///表面颜色（应用于界面中的各种容器背景，通过不同的颜色凸显层次感）
      ///默认背景色（在Material3中也用于背景色、AppBar背景色）
      surface: AppColors.grey99,
      onSurface: AppColors.grey10,
      inverseSurface: AppColors.grey20,
      onInverseSurface: AppColors.grey95,

      ///surface变种（变种颜色用于在背景上凸显分组内容、悬浮卡片等层级关系，Material3对其细分）
      surfaceVariant: AppColors.blueGrey90,
      //已过时，被surfaceContainerHighest取代
      onSurfaceVariant: AppColors.blueGrey30,

      ///用于分组内容的容器背景（如卡片、列表项）
      surfaceContainer: AppColors.blueGrey90,

      ///轻度强调的容器背景（如悬浮菜单）
      surfaceContainerLow: AppColors.blueGrey90,

      ///中度强调的容器背景（如对话框）
      surfaceContainerHigh: AppColors.blueGrey90,

      ///最高强调的容器背景（如模态框、弹出菜单）
      surfaceContainerHighest: AppColors.blueGrey90,

      ///轮廓线（间隔线、边框等颜色，比如开关组件处于关闭状态时边框与圆点就会是这个颜色）
      outline: AppColors.blueGrey60,
    ), //
    textTheme: textTheme,
  );

  ///暗色主题
  static ThemeData dark = ThemeData(
    colorScheme: ColorScheme.fromSeed(
      seedColor: AppColors.blue40,
      brightness: Brightness.dark,
    ).copyWith(
      primary: AppColors.blue80,
      onPrimary: AppColors.blue20,
      primaryContainer: AppColors.blue30,
      onPrimaryContainer: AppColors.blue90,
      inversePrimary: AppColors.blue40,
      secondary: AppColors.darkBlue80,
      onSecondary: AppColors.darkBlue20,
      secondaryContainer: AppColors.darkBlue30,
      onSecondaryContainer: AppColors.darkBlue90,
      tertiary: AppColors.yellow80,
      onTertiary: AppColors.yellow20,
      tertiaryContainer: AppColors.yellow30,
      onTertiaryContainer: AppColors.yellow90,
      error: AppColors.red80,
      onError: AppColors.red20,
      errorContainer: AppColors.red30,
      onErrorContainer: AppColors.red90,
      //已过时，被surface取代
      background: AppColors.grey10,
      //已过时，被onSurface取代
      onBackground: AppColors.grey90,
      surface: AppColors.grey10,
      onSurface: AppColors.grey80,
      inverseSurface: AppColors.grey90,
      onInverseSurface: AppColors.grey20,
      //已过时，被surfaceContainerHighest取代
      surfaceVariant: AppColors.blueGrey30,
      onSurfaceVariant: AppColors.blueGrey80,
      surfaceContainer: AppColors.blueGrey30,
      surfaceContainerLow: AppColors.blueGrey30,
      surfaceContainerHigh: AppColors.blueGrey30,
      surfaceContainerHighest: AppColors.blueGrey30,
      outline: AppColors.blueGrey60,
    ), //
    textTheme: textTheme,
  );
}
